<template>
<div class="map-left" v-height>
    <el-tabs v-model="activeName" tab-position="top" :stretch="true" @tab-click="handleClick">
        <el-tab-pane label="采集中" name="first">
            <TaskCollect activeName="first" key="first" :TaskList='TaskList' @filterMapSuccess="filterMapSuccess">采集中</TaskCollect>
        </el-tab-pane>
        <el-tab-pane label="已到期" name="second">
            <TaskCollect activeName="second" key="second" :TaskList='TaskList' @filterMapSuccess="filterMapSuccess">已到期</TaskCollect>
        </el-tab-pane>
        <el-tab-pane label="数据查看" name="third">
            <DataView>数据查看</DataView>
        </el-tab-pane>
    </el-tabs>
</div>
</template>

<script>
export default {
    name: "MapLeft",
    data() {
        return {
            activeName: "first",
            TaskList: [],
            params: {
                pageNumber: 1,
                pageSize: 30,
                planStatus:""
            },
        };
    },
    components: {
        TaskCollect: () => import("./TaskCollect/TaskCollect.vue"),
        // Expired: () => import("./Expired/Expired.vue"),
        DataView: () => import("./DataView/DataView.vue"),
    },
    created() {
        let userInfo = {};
        if (localStorage.getItem("userInfo")) {
            userInfo = JSON.parse(localStorage.getItem("userInfo"));
            if (userInfo.userLevel === 3) {
                this.activeName = "third";
            }
        }

        // let currentTask = {};
        // if (localStorage.getItem("currentTask/setCurrentTask")) {
        //     currentTask = JSON.parse(localStorage.getItem("currentTask/setCurrentTask"));
        //     this.TaskList.forEach((item) => {
        //         if (item.id !== currentTask.id) {
        //             localStorage.removeItem("currentTask/setCurrentTask")
        //         } else {
        //             localStorage.setItem("currentTask/setCurrentTask", item[0])
        //         }
        //     })
        // }

        this.getQueryMyPlan()
    },
    methods: {
        getQueryMyPlan() {
            if (localStorage.getItem('SYS_TYPE')) {
                this.params.systemTypeList = localStorage.getItem('SYS_TYPE');
                this.params.planStatus = 2
                this.$axios
                    .get("task/task/queryMyPlan", {
                        params: this.params,
                    })
                    .then((res) => {
                        console.log(res.data.list)
                        if (res.data ?.list instanceof Array && res.data ?.list.length > 0) {
                            this.TaskList = res.data ?.list;
                        } else {
                            this.TaskList = []
                        }
                    });

            }

        },
        handleClick() {
            this.TaskList = []
            if (this.activeName === 'second') {
                this.params.isExpire = 1
                this.getQueryMyPlan()
            } else {
                this.params.isExpire = 0
                this.params.collectStatus = 1
                this.getQueryMyPlan()
            }
        },
        filterMapSuccess(res) {
            console.log(res);
            this.$emit("filterMapSuccess", res);
        },
    },
};
</script>

<style lang="scss" scoped>
.map-left {
    // position: absolute;
    // top: 0;
    // left:0;
    // bottom: 0;
    position: relative;
    background: #fff;
    width: 300px;
    border-right: 1px solid #ddd;
}
</style>
